import React from 'react';
import { inject, observer } from 'mobx-react'
import { withRouter } from 'react-router-dom'
import Loading from '@/components/Base/Loading'

const asyncComponent = (importComponent) => {
  @inject('store')
  @observer
  class Restricted extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        component: null
      }
    }
    timeStrmp() {//转发时刷新组件
      const _id = this.props.match.params?.id
      if (_id) return Date.now()
    }
    componentDidMount() {
      importComponent()
        .then((cmp) => {
          this.setState({ component: cmp.default });
        });
    }
    componentWillUnmount() {
      this.setState = () => false
    }
    render() {
      const C = this.state.component;
      return C ? <C key={this.timeStrmp()} {...this.props} /> : <Loading/>;
    }
  }
  return withRouter(Restricted);
};
export default asyncComponent;